<template>
  <div class="arrow-box">
    <div class="line"></div>
    <div class="arrow"></div>
  </div>
</template>

<script lang="ts" setup></script>

<style scoped lang="scss">
.arrow-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 60px;
  .line {
    border-left: 2px solid #fff;
    height: 90px;
  }
  .arrow{
    width: 0px;
    height: 0px;
    border-top: 0px solid transparent;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
    transform: rotate(180deg);
  }  
}
</style>